<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>一加官网</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="shortcut icon" type="yijia.ico" href="yijia.ico" />
		<link rel="stylesheet" type="text/css" href="css/style2.css" />
	</head>
	<body>
	<div class="wenjuan">
		<h3>用户反馈</h3>
		<img src="img/tc_close.png" />
		<div class="wenjuanl">
			<textarea type="text" placeholder="希望得到对您网页设计及用户体验方面的反馈，感谢。"></textarea>
			<p>提醒：请勿输入您的隐私信息，如账号密码等。</p>
			<button>提&nbsp;&nbsp;&nbsp;&nbsp;交</button>
		</div>
	</div>
	<div class="box-d">
		<div class="boxd">
			<div class="boxs">
				<img src="img/wenjuan.png" />
			</div>
			<div class="boxa">
				<img src="img/Telephone.png" />
				<p id="lajij">400-888-1111</p>
			</div>
			<div class="box">
				<img src="img/top_bg_01_02.gif" />
			</div>
			<a href="javascript:;" id="btn" title="返回顶部"></a>
		</div>
	</div>

	
		<nav>
			<div class="container">
				<div class="nav">
					<ul class="nav-logo">
						<li>
							<a href="index.html"></a>
						</li>
					</ul>
					<span class="nav-btn">展开</span>
					<ul class="nav-daohang">
						<li>
							<a href="">OnePlus 7 Pro</a>
						</li>
						<li>
							<a href="">OnePlus 7</a>
						</li>
						<li>
							<a href="" id="sahng">商城</a>
						</li>
						<li>
							<a href="index3.html">品牌</a>
						</li>
						<li>
							<a href="">服务</a>
						</li>
						<li>
							<a href="">论坛</a>
						</li>
						<li>
							<a href="">零售店</a>
						</li>
					</ul>
					<ul class="nav-right">
						<li>
							<a href="javascript:;" id="geren"><i></i></a>
						</li>
						<li>
							<a href="javascript:;" id="gouwu"><i></i></a>
						</li>
						<li>
							<a href="javascript:;" class="nav-right-sosuo"><i></i></a>
						</li>
					</ul>
				</div>
			</div>
			<div class="shang">
				<ul>
					<li>
						<a href=""><i></i>
							<p>手机</p>
						</a>
					</li>
					<li>
						<a href=""><i></i>
							<p>耳机</p>
						</a>
					</li>
					<li>
						<a href=""><i></i>
							<p>壳/膜</p>
						</a>
					</li>
					<li>
						<a href=""><i></i>
							<p>适配器/数据线</p>
						</a>
					</li>
					<li>
						<a href=""><i></i>
							<p>套装</p>
						</a>
					</li>
					<li>
						<a href=""><i></i>
							<p>生活馆</p>
						</a>
					</li>
				</ul>
			</div>
			<div class="grern">
				<ul>
					<li>
						<a href="">订单</a>
					</li>
					<li>
						<a href="">账户</a>
					</li>
					<li>
						<a href="">推荐有礼</a>
					</li>
					<p>
						<a href="">登录</a>
					</p>
				</ul>
			</div>
			<div class="gouwu">
				<div class="shangpin">
					<p>您的购物车里没有商品</p>
				</div>
				<div class="lll">
					<div class="lle"></div>
					<a href=""><span>去购物</span></a>
				</div>
			</div>

			<div class="search">
				<form>
					<i class="so"></i>
					<input type="text" value="" placeholder="搜索商品名称" />
					<label for="header-search" class="cha"></label>
				</form>
				<ul>
					<li>
						<a href="">一加银耳2T</a>
					</li>
					<li>
						<a href="">一加手机6T 3D钢化玻璃保护膜 （黑色）</a>
					</li>
					<li>
						<a href="">一加手机6T 芳纶纤维全包保护壳</a>
					</li>
					<li>
						<a href="">OnePlus6T 硅胶保护壳（红色）</a>
					</li>
				</ul>
			</div>
		</nav>

		<div class="main">
			<div class="main-sabe">
				<h1>欢迎使用 OnePlus 服务</h1>
				<h3 class="prompt">有什么可以帮你？</h3>
				<div class="inpute-sabe">
					<img src="img/sosuo.png" />
					<input type="text" placeholder="搜索服务" />
				</div>

			</div>
		</div>

		<div class="sub">
			<div class="container">
				<h2>常驻服务</h2>
				<div class="sun-row">
					<a href="">
						<div class="img">
							<img src="img/fc19d6d7dc403da71b3fa797ae68baf1.png" alt="" />
						</div>
						<div class="text">
							<p>产品支持</p>
							<p>查看产品使用手册，获取更多玩机技巧</p>
						</div>
					</a>
					<a href="">
						<div class="img">
							<img src="img/bf395bcfb10e1e2a7e63222a628f5786.png" alt="" />
						</div>
						<div class="text">
							<p>购买帮助</p>
							<p>购买、支付、发货、退货等常见问题帮助</p>
						</div>
					</a>
					<a href="">
						<div class="img">
							<img src="img/49459bb51b7003f5e02a383977250349.png" alt="" />
						</div>
						<div class="text">
							<p>排除故障</p>
							<p>全面解决方案，自动排除故障</p>
						</div>
					</a>
					<a href="" class="rabc">
						<div class="img">
							<img src="img/252a7af9421a459d18d0e04762402e08.png" alt="" />
						</div>
						<div class="text">
							<p>寄修服务</p>
							<p>双向快递维修，享受便捷维修</p>
						</div>
					</a>
					<a href="">
						<div class="img">
							<img src="img/3bf6b9b2d406ba58c0393b5d734281bc.png" alt="" />
						</div>
						<div class="text">
							<p>服务中心查询</p>
							<p>前往服务中心，体验快速维修</p>
						</div>
					</a>
					<a href="">
						<div class="img">
							<img src="img/0af02280ff1dd4f7dee38bef6766f62f.png" alt="" />
						</div>
						<div class="text">
							<p>维修价格查询</p>
							<p>保外维修常用备件价格及人工服务费用</p>
						</div>
					</a>
					<a href="">
						<div class="img">
							<img src="img/c85bbb0870f048aba4d69bbbe356ce40.png" alt="" />
						</div>
						<div class="text">
							<p>系统下载和更新</p>
							<p>下载最新系统，体验最新功能</p>
						</div>
					</a>
					<a href="" class="rabc">
						<div class="img">
							<img src="img/ad877ec4b2c6979c85526442fac396b2.png" alt="" />
						</div>
						<div class="text">
							<p>保障服务查询</p>
							<p>查询加多保手机保障服务状态</p>
						</div>
					</a>
				</div>
			</div>
		</div>

		<div class="sabcs">
			<div class="container app">
				<h2>热门主题</h2>
				<ul>
					<li v-for="link in message">
						<img :src="link.img" />
						<div class="right">
							<h3><a href="#">{{link.title}}</a></h3>
							<p>{{link.linke}}</p>
							<a href="">查看详情<i>﹥</i></a>
						</div>
					</li>

				</ul>
			</div>
		</div>

		<div class="nouuer">
			<div class="container">
				<div class="nouuer-top">
					<h2>发现更多</h2>
					<p>更多有关产品和服务的信息</p>
				</div>
				<div class="nouuer-botton">
					<a href="">OnePlus 手机规格参数</a>
					<a href="">手机产品15天退货服务说明</a>
					<a href="">手机产品30天换货服务说明 </a>
					<a href="">一加商城选购配件、生活馆产品三包政策</a>
					<a href="">一加手机预置应用公示</a>
					<a href="">一加隐私政策</a>
				</div>
			</div>
		</div>
		<div class="nouuer">
			<div class="container">
				<div class="nouuer-top">
					<h2>联系我们</h2>
					<p>您也可以通过电话，在线聊天等方式获得帮助</p>
					<a href="" class="kefu">在线客服</a>
					<p>周一至周日 9:00 - 22:00 <br />和我们的客服在线沟通，一对一为你解答</p>
				</div>
				<div class="nouuer-botton">
					<div class="top">
						<h4>服务热线</h4>
						<a href="">400-888-1111</a>
						<p>周一至周日 9:00 - 22:00</p>
					</div>
					<div class="boutter">
						<h4>服务中心</h4>
						<a href="">查找附近的服务中心></a>
						<p>前往服务中心，和我们的维修工程师面对面沟通</p>
					</div>
				</div>
			</div>
		</div>

		<div class="footer">
			<div class="container">
				<div class="footer-nav">
					<dl>
						<dt>一加产品</dt>
						<dd>
							<ul>
								<li>
									<a href="">OnePlus 7 Pro</a>
								</li>
								<li>
									<a href="">OnePlus 7</a>
								</li>
								<li>
									<a href="">OnePlus 6T</a>
								</li>
								<li>
									<a href="">OnePlus 6</a>
								</li>
								<li>
									<a href="">OnePlus 5T</a>
								</li>
							</ul>
						</dd>
					</dl>
					<dl>
						<dt>热门活动</dt>
						<dd>
							<ul>
								<li>
									<a href="">推荐有礼</a>
								</li>
								<li>
									<a href="">以旧换新</a>
								</li>
								<li>
									<a href="">Shot on OnePlus</a>
								</li>
								<li>
									<a href="">邀请码购买</a>
								</li>
							</ul>
						</dd>
					</dl>
					<dl>
						<dt>关于一加</dt>
						<dd>
							<ul>
								<li>
									<a href="">了解一加</a>
								</li>
								<li>
									<a href="">加入一加</a>
								</li>
								<li>
									<a href="">H2OS</a>
								</li>
								<li>
									<a href="">云服务</a>
								</li>
								<li>
									<a href="">预置应用公式</a>
								</li>
							</ul>
						</dd>
					</dl>
					<dl>
						<dt>服务支持</dt>
						<dd>
							<ul>
								<li>
									<a href="">购买帮助</a>
								</li>
								<li>
									<a href="">用户手册</a>
								</li>
								<li>
									<a href="">寄修服务</a>
								</li>
								<li>
									<a href="">服务中心</a>
								</li>
								<li>
									<a href="">联系我们</a>
								</li>
							</ul>
						</dd>
					</dl>
					<dl>
						<div class="text-cn">
							<a href=""><i></i>400-888-1111</a>
							<div class="bot">
								<div class="bot-yi"></div>
								<a href="">在线客服</a>
							</div>
							<p>周一至周日 9:00-22:00</p>
							<p class="deee">
								<a href=""><i></i></a>
								<a href=""><i></i></a>
							</p>
						</div>
					</dl>
				</div>
				<div class="text-neir">
					<div class="jjj"><i></i>中国( 简体中文/CNY )</div>
					<ul>
						<li>
							<a href="">隐私政策</a>
						</li>
						<li>
							<a href="">用户协议</a>
						</li>
						<li>
							<a href="">竞赛规则</a>
						</li>
						<li>
							<a href="">知识产权政策</a>
						</li>
						<li>
							<a href="">安全问题反馈</a>
						</li>
						<li>
							<a href="">站点地图</a>
						</li>
					</ul>
				</div>
				<div class="text-nbar">
					<div class="nbar-ne">
						<p>© 2013-2019 OnePlus. All Rights Reserved.</p>
						<p>粤ICP备13080605号-4 | 备案主体编号:44201910955995</p>
						<a href=""><img src="img/badge.png" />粤公网安备 44030402001407号</a>
					</div>
					<div class="nbar-nn"><img src="img/51638e8fd2593c56856278feb794b506.png" /><img src="img/cnnic.png" /></div>
				</div>
			</div>
		</div>

		<script src="js/vue.js"></script>
		<script src="js/axios.min.js"></script>
		<script src="js/js.js"></script>
		<script type="text/javascript">
			new Vue({
				el: '.app',
				data: {
					message: '正在请求数据...'
				},
				mounted() {
					axios
						.get('json/vue.json')
						.then(response => (this.message = response.data.link))
						.catch(function(error) {
							console.log(error);
						})
				}
			});
		</script>
	</body>

</html>